<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <!--头部固定引用-->
  <meta charset="utf-8">
  <meta name="full-screen" content="yes">
  <meta name="x5-fullscreen" content="true">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
  <link rel="stylesheet" href="../../css/base.css">
  <link rel="stylesheet" href="../../css/video-js.min.css">
  <!--固定引用结束,自定义引用添加在下面-->
  <title>JT2</title>
  <!--页面样式添加在这里，多看看base。css里面的公共样式，大部分常用的都有，避免使用独立css文件为单独页面设置样式，避免随意添加样式到公共样式-->
  <style>
      .videoPlay {
        padding-top: 0.9rem;
      }
      .video-js .vjs-big-play-button{
          border: none;
        }
        .video-js .vjs-control:focus, .video-js .vjs-control:focus:before, .video-js .vjs-control:hover:before {
          text-shadow: none !important;
          border: none;
        }
      .videoPlay-seatimg {
        height: 4.22rem;
        width: 7.5rem;
        position: relative;
      }
      .videoPlay-seatimg .playBtn {
        width: 0.96rem;
        height: 0.96rem;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
      }
      .videoPlay-seatimg .bgcImg{
        height: 4.22rem;
        width: 7.5rem;
      }
      .videoPlay video{
          height: 4.22rem;
          width: 7.5rem;
          /* display: none; */
      }

      .videoPlay-desc .subtitle span:nth-child(1){
        position: absolute;
        left: 0;
      }
      .videoPlay-desc .subtitle span:nth-child(2){
          position: absolute;
          right: 0;
      }

      .chapterlist {
        position: relative;
        height: 0.42rem;
        margin-bottom: 0.38rem;
      }

      .head-img {
       vertical-align: middle;
      }

      .chapterlist img {
          position: absolute;
          right: 0;
          top: 50%;
          transform: translateY(-50%);
          width: 0.22rem;
          height: 0.12rem;
      }
      .chaptercontent {
        height: 1.56rem;
        /* display: none; */
      }
      .chaptercontent .desc img {
          width: 0.28rem;
          height: 0.28rem;
          position: absolute;
          top: 0.26rem;
          left: 0.2rem;
      }
      .chaptercontent .desc .img1{
          display: none
      }
      .chaptercontent .desc .img2{
          display: block;
      }
      .chaptercontent .desc.active {
            background: #FAF2F3;
            color: #C7000B;
        }
      .chaptercontent .desc.active .img1{
          display: block;
      }
      .chaptercontent .desc.active .img2{
          display: none;
      }
      .videoPlay-comment .commentmain {
        padding: 0.24rem 0.26rem 0.32rem 0.3rem;
        position: relative;
        display: flex;
      }
      .videoPlay-comment .commentmain .mainCenter{
        flex: 3;
      }
      .videoPlay-comment .commentmain .mainTop .imgbox{
            display: inline-block;
            vertical-align: middle;
            width: 0.68rem;
            height: 0.68rem;
            /* backgrounrgb(10, 10, 10)ink; */
            margin-right: 0.22rem;
            border-radius: 50%;
      }
      .videoPlay-comment .commentmain .mainTop .imgbox img {
            width: 0.68rem;
            height: 0.68rem;
      }
      .videoPlay-comment .commentmain .mainbottom{
        /* margin-left:0.9rem; */
        position: relative;
        height: 0.34rem;
        margin-bottom: 0.32rem;
      }
      .videoPlay-comment .commentmain .mainCenter .comment-isTop {
            color: #FEA800;
            border: 1px solid #FEA800;
            border-radius: 5px 0 5px 0;
            font-size: .24rem;
            padding: .02rem .1rem;
            margin-left: .22rem;
        }
      .videoPlay-comment .commentmain .mainbottom .mainbottom-left{
        position: absolute;
        left: 0;
      }
      .videoPlay-comment .commentmain .mainbottom-right {
        width: 0.36rem;
        margin-left:.2rem;
      }
      .videoPlay-comment .commentmain .mainbottom-right img{
          width: 0.35rem;
          height: 0.36rem;
          margin-right: 0.06rem;
      }
      .videoPlay-comment .commentmain .secondcomment{
          margin-left: 0.78rem;
      }
      .videoPlay-comment .commentmain .secondcomment .secondcomment-top .imgbox{
        width: 0.48rem;
        height: 0.48rem;
        border-radius: 50%;
        /* background: pink; */
        display: inline-block;
        margin-right: 0.2rem;
      }

      .videoPlay-comment .commentmain .secondcomment .secondcomment-explain{
        margin-left: 0.68rem;
        position: relative;
        height: 0.34rem;
        margin-bottom: 0.24rem;
      }
      .secondcomment-explain-left {
        position: absolute;
        left: 0;
      }
      .secondcomment-explain-right{
        position: absolute;
        right: 0.25rem;
      }
      .secondcomment-explain-right img{
          width: 0.32rem;
          height: 0.32rem;
          margin-right: 0.08rem;
      }
      .secondcomment-seeAll {
        padding: 0.1rem 0.2rem;
            /* height: 0.34rem; */
            /* margin-left: 0.46rem; */
            background: rgba(216, 216, 216, 0.24);
      }
      .secondcomment-seeAll span{
        font-family: PingFangSC-Regular;
        font-size: 0.24rem;
        color: rgba(0, 0, 0, 0.65);
        line-height: 0.34rem;
      }
      .blank {
          height: 0.52rem;
          background-color: #fff;
      }
      .videoPlay-footer-imgBox {
          position: relative;
          display: inline-block;
          /* vertical-align: middle; */
          margin-right: 0.2rem;
      }
      .videoPlay-footer-imgBox img {
          width: 0.36rem;
          height: 0.36rem;
      }
      .videoPlay-footer-imgBox span{
        position: absolute;
        right: -0.24rem;
        top: -0.18rem;
        font-family: PingFangSC-Regular;
        font-size: 0.22rem;
        color: #FFFFFF;
        width: 0.38rem;
        height: 0.24rem;
        text-align: center;
        background: #EF4244;
        border-radius: 0.12rem;
        line-height: 0.24rem;
        text-align: center;
      }
      .Interactiondetails-footer-imgBox .shafa {
        height: 0.3rem;
        line-height: 0.3rem;
        width: 0.8rem;
        right: -0.6rem;
      }
      .commentmain-no-img {
          padding-top: 1.08rem;
          padding-bottom: 0.52rem;
          text-align: center;
      }
      .commentmain-no-img  img {
          width: 2.36rem;
          height: 1.42rem;
      }
      .commentmain-no-text {
        text-align: center;
        padding-bottom: 3.42rem;
      }

      .footer-noconfirm {
        display: block;
      }
      .footer-confirm {
        display: none;
      }
      .tpimg {
        vertical-align: middle;
      }
      .videoPlay-header .img1 {
          width: 0.32rem;
          height: 0.32rem;
          position: absolute;
          left: 0.32rem;
          top: 50%;
          transform: translateY(-50%);
      }
      .videoPlay-header .img2{
        width: 0.32rem;
          height: 0.32rem;
          position: absolute;
          right: 0.32rem;
          top: 50%;
          transform: translateY(-50%);
      }
      .wrapper {
        width: 6.8rem;
        height: 1.56rem;
        overflow: hidden;
      }
      .descSpan {
        text-overflow: -o-ellipsis-lastline;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
      }
      .vjs-paused .vjs-big-play-button,
      .vjs-paused.vjs-has-started .vjs-big-play-button {
          display: block;
      }
      /*  */
      .videoPlay-desc {
    /* padding: 0.38rem 0.4rem 0.36rem 0.3rem; */
    padding: 0.38rem 0.4rem 0 0.3rem;
    margin-bottom: 0.14rem;
}
.videoPlay-desc .title {
  font-family: PingFangSC-Medium;
  font-size: 0.36rem;
  letter-spacing: 0;
  line-height: 0.5rem;
  margin-bottom: 0.22rem;
}
.videoPlay-desc .subtitle {
  position: relative;
  height: 0.4rem;
  font-family: PingFangSC-Regular;
  font-size: 0.28rem;
  letter-spacing: 0;
  text-align: left;
  line-height: 0.4rem;
  margin-bottom: 0.18rem;
}
.videoPlay-desc .time {
  font-family: PingFangSC-Regular;
  font-size: 0.26rem;
  line-height: 0.36rem;
  padding-bottom: 0.36rem;
  margin-bottom: 0.28rem;
}
.chapterlist span:nth-child(1){
  position: absolute;
  left: 0;
  font-family: PingFangSC-Semibold;
  font-size: 0.3rem;
  letter-spacing: 0;
  line-height: 0.42rem;
}
.chapterlist span:nth-child(2){
  position: absolute;
  right: 0;
  font-family: PingFangSC-Regular;
  font-size: 0.26rem;
  line-height: 0.42rem;
}
.chaptercontent .desc{
  display: inline-block;
  width: 2.7rem;
  position: relative;
  padding: 0.2rem 0.24rem 0.28rem 0.64rem;
  font-family: PingFangSC-Regular;
  font-size: 0.26rem;
  line-height: 0.36rem;
  margin-right: 0.1rem;
}
.videoPlay-comment {
  padding-bottom: 1.02rem;
}
.videoPlay-comment .commentheader {
  padding: 0.3rem 0.26rem  0.26rem;
  font-family: PingFangSC-Medium;
  font-size: 0.28rem;
  line-height: 0.4rem;
}
.videoPlay-comment .line {
  width: 100%;
  height: 0.02rem;
}
.videoPlay-comment .commentmain .comstatus {
  position: absolute;
  top: 0.24rem;
  right: 0.32rem;
  font-size: 0.24rem;
  font-weight: 400;
}
.videoPlay-comment .commentmain .mainTop span {
  font-family: PingFangSC-Semibold;
  font-size: 0.28rem;
  line-height: 0.68rem;
}
.videoPlay-comment .commentmain .maintext {
  word-break:break-all;
  word-wrap:break-word;
  /* margin-left: 0.9rem; */
  font-family: PingFangSC-Regular;
  font-size: 0.3rem;
  line-height: 0.44rem;
  margin-bottom: 0.2rem;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
}
.videoPlay-comment .commentmain .mainbottom .mainbottom-left span:nth-child(1){
  font-family: PingFangSC-Regular;
  font-size: 0.24rem;
  margin-right: 0.32rem;
}
.videoPlay-comment .commentmain .mainbottom .mainbottom-left span:nth-child(2){
  font-family: PingFangSC-Regular;
  font-size: 0.24rem;
}
.videoPlay-comment .commentmain .mainbottom .mainbottom-right{
  position: absolute;
  right: 0.25rem;
  font-family: MicrosoftYaHeiUI;
  font-size: 0.24rem;
  letter-spacing: 0;
}
.videoPlay-comment .commentmain .secondcomment .secondcomment-top span {
  font-family: PingFangSC-Medium;
  font-size: 0.24rem;
  line-height: 0.48rem;
}
.videoPlay-comment .commentmain .secondcomment .secondcomment-text{
  font-family: PingFangSC-Regular;
  font-size: 0.28rem;
  line-height: 0.4rem;
  margin-left: 0.68rem;
}
.secondcomment-explain-left span:nth-child(1){
  font-family: PingFangSC-Regular;
  font-size: 0.24rem;
  margin-right: 0.32rem;
}
.secondcomment-explain-left span:nth-child(2){
  font-family: PingFangSC-Regular;
  font-size: 0.24rem;
}
.secondcomment-explain-right span {
  font-family: MicrosoftYaHeiUI;
  font-size: 0.24rem;
  letter-spacing: 0;
  text-align: justify;
}
.videoPlay-footer {
  padding: 0.2rem 0 0.2rem 0.32rem;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 1;
  display: flex;
  flex: auto;
  align-items: end;
}
.videoPlay-footer .mainfooter {
  white-space: nowrap;
  padding-right: 0.26rem;
}
.videoPlay-footer form{
  width: 100%;
  /* 4.68rem; */
  max-width: 100%;
  height: 0.6rem;
  padding: 0.12rem 0 0.12rem 0.28rem;
  font-family: PingFangSC-Regular;
  font-size: 0.26rem;
  margin-right: 0.3rem;
  display: inline-block;
}
.commentmain-no{

}
.commentmain-no-text span{
  font-family: PingFangSC-Regular;
  font-size: 0.28rem;
  line-height: 0.44rem;
}
.fixed-content{
  position: fixed;
  top: 0;
  bottom:0.7rem;
  width:100%;
  overflow:scroll;
}
.videoPlay-header {
  padding:0.22rem 0.32rem 0.26rem;
  font-family: PingFangSC-Medium;
  font-size: 0.32rem;
  letter-spacing: 0;
  text-align: center;
  position: fixed;
  top: 0;
  width: 100%;
  height: 0.9rem;
  z-index: 1;
}
.videoPlay-header .videotitle {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  font-size: 0.32rem;
  font-weight: 600;
  width: 2.56rem;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box!important;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
  </style>
</head>
<!--尽量不要在body上添加样式，除了背景色-->
<body>
<div>
  <!--具体代码-->
    <div class="videoPlay-header">
      <img src="../../images/allPic/jiantou.png" alt="" onclick='closeWindow()' class="img1 headerimg">
      <div class="videotitle"></div>
      <img class="img2" style="right: 0.8rem; width: 0.4rem; height: 0.4rem" src="../../images/jubao.jpg" onclick="report()" />
      <img src="../../images/allPic/fenxiang.png" alt="" onclick="goShare()" class="img2">
    </div>
    <!-- 视频播放 -->
    <div class="fixed-content">
      <div class="videoPlay">
        <!-- <div class="videoPlay-seatimg" onclick='playbgVideo(this)'> -->
          <!-- <img src="../../images/allPic/shipingbtn.png" alt="" class="playBtn">
          <img src="" alt="" class="bgcImg"> -->
        <!-- </div> -->
        <!-- <video  controls autoplay  id='video' style="object-fit: fill;" src="" controlsList='nofullscreen nodownload' webkit-playsinline="true"></video> -->
        <!-- <source src=""> -->
        <!-- </video> -->
      </div>
      <div class="videoPlay-desc">
        <div class="videoDetails">
        </div>
        <div class="chapterlist">
        </div>
        <div class="wrapper">
          <div class="chaptercontent">
          </div>
        </div>
      </div>

      <!-- 评论内容 -->
      <div class="videoPlay-comment">
        <div class="commentheader">
        </div>
        <div class="line"></div>
        <div class="maincomment"></div>
      </div>
    </div>

    <!-- 底部输入框 -->
    <div class="videoPlay-footer">
      <form action="javascript:return true">
        <input type="text" placeholder="请说说你的看法..." class="commentInpt">
      </form>
      <div style='display:inline-block;text-align: center;' class="mainfooter"></div>
    </div>
</div>
</body>
<!--下面五个文件为固定引用，自己根据情况调整路径，不要跟换引入顺序，其他引用添加在后面-->
<script src="../../js/dict.js"></script>
<script src="../../js/jquery-3.4.1.min.js"></script>
<script src="../../js/checkJsBridge.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/api.js"></script>
<script src="../../plugin/better-scroll/better-scroll.min.js"></script>
<script src="../../js/video.min.js"></script>
<!-- <script src="../../js/hls.js"></script> -->
<!--固定引用结束-->
<!--避免一个页面包含过多功能，减少js重绘页面，推荐分功能，分页面-->
<script>
  videojs.options.flash.swf = 'http://example.com/path/to/video-js.swf'
  let listLength
  //commentObjectId就是infoId
  let level = 1 // 1:一级评论 2:二级评论
  let commentObjectId
  let isopencomment = '0'
  let token
  let pageNum = 1
  //是否可评论
  let isComment = ''
  //封面图
  let coverImgUrl = ''
  //分享的标题和内容
  let sharetitle = ''
  let sharecontent = ''
  //收藏初始状态
  let collectStatus = ''
  let type = ''
  /*固定页面初始化方法，用于替代$(function(){}),param为url参数，Object类型*/
  function initPage(params) {
    commentObjectId = params.infoId
    // type: 1  直播回放 ，type!= 1长视频有章节
    type = params.type

    //设置深色模式
    if(configColorType === '1'){
      $('.headerimg').attr('src','../../images/allPic/blackfanhui.png')
    }else{
      $('.headerimg').attr('src','../../images/allPic/jiantou.png')
    }

    if(params.isopencomment){
      isopencomment = params.isopencomment
    }
    //
    //页面加载获取token用于判断是否可以评论或者点赞
    jsBridge.getData('token').then(res => {
      // console.log(res)
      token = res
    })
    $('.maincomment').empty()
    // console.log(params)
    getLsit(params)
    getVideoDetails(params)
    // getComment(params)
    getfooterStatus(params)
    //章节列表可滑动
    setTimeout(function(){
      let width = ($('.chaptercontent .desc').eq(1).outerWidth(true) + 10) * $('.chaptercontent .desc').length
      $('.chaptercontent').css('width',width * 0.02 + 'rem')
      let wrapper = document.querySelector('.wrapper')
      let BScroll = new BetterScroll.createBScroll(wrapper,{
        startX: 0,
        click: true,
        scrollX: true,
        // 忽略竖直方向的滚动
        scrollY: false
      })

      //章节渲染完成之后将第一条数据播放
      let url = $('.desc').eq(0).attr('data-url')
      // let url = 'https://ifis-cloud.jddglobal.com/customer/manager/download/uat/m3u8/38a708a9-b08b-4ff0-a9ba-85aa2708591b.m3u8'

      // var myPlayer = videojs('video')

      // videojs("video").ready(function() {
      //         var myPlayer = this;
      //         myPlayer.src(url); /*动态设置video.js播放的地址。*/
      //         myPlayer.autoplay();
      // });

      // $('#video').attr('src',url)
      // $('#video').attr('src','https://ifis-cloud.jddglobal.com/customer/manager/download/uat/m3u8/38a708a9-b08b-4ff0-a9ba-85aa2708591b.m3u8')
      // $('#video')[0].play()

      // 解决播放问题start
      let myVideo = videojs('video',{fluid: true},{
        bigPlayButton: true,
        textTrackDisplay: false,
        posterImage: false,
        errorDisplay: false,
      })
      if (/\.m3u8$/.test(url)) { //判断视频源是否是m3u8的格式
        myVideo.src({
          src: url,
          type: 'application/x-mpegURL' //在重新添加视频源的时候需要给新的type的值
        })
      } else {
        myVideo.src(url)
      }
      myVideo.load()
      myVideo.play()

      // 解决播放问题end

      $('.desc').eq(0).addClass('active').siblings().removeClass('active')
    },500)


  }

  /*页面所在窗口由后台前台时触发的方法,param为url参数，Object类型*/
  function startPage(params) {
  }

  function reLoadPage() {
    jsBridge.getData('token').then(res => {
      // console.log(res)
      token = res
    })
    // $('.videoPlay').empty()
    // $('.videoDetails').empty()
    // $('.videoPlay-seatimg').empty()
    $('.maincomment').empty()
    $('.mainfooter').empty()
    pageNum = 1
    getfooterStatus({'infoId':commentObjectId})
    getComment({'infoId':commentObjectId,'pageNum':pageNum})
    // getVideoDetails({'infoId':commentObjectId})
  }
  //获取视频详情
  function getVideoDetails(params){
    Server.getVideoList.videoDetail({'infoId':params.infoId}).then(res => {
      $('.videoPlay').empty()
      $('.videoDetails').empty()
      $('.videoPlay-seatimg').empty()
      if(res.code === 0){
        //顶部显示标题
        $('.videotitle').text(res.data.result.mainTitle)
        //获取分享的标题和内容
        sharetitle = res.data.result.mainTitle
        sharecontent = res.data.result.courseIntroduction

        //设置加载封面图
        let video = `<video  poster='${res.data.result.coverImgUrl ? res.data.result.coverImgUrl : '../../images/allPic/zhanweitu.png'}' id='video' style="object-fit: ${res.data.result.isVertical == "1" ? 'scale-down' : 'fill'};" src=""  webkit-playsinline="true" playsinline="true" x-webkit-airplay="allow" x5-video-player-type="h5" x5-video-player-fullscreen="true" x5-video-orientation="portrait" disablePictureInPicture controls controlslist="nodownload" class="video-js vjs-big-play-centered"></video>`
        $('.videoPlay').append(video)

        // coverImgUrl = res.data.result.coverImgUrl
        // $('#video').attr('poster',coverImgUrl)
        //同步上一级的已学数
        jsBridge.updateStatus({'type':'refresh','name':'refresh','infoId':commentObjectId,'value':'1'})
        //同步原生页面的阅读数
        let readCount = res.data.result.readCnt
        jsBridge.updateStatus({'type':'video','name':'read','infoId':commentObjectId,'value':readCount})
        //是否可评论即是否展示评论
        isComment = res.data.result.isComment
        if(isComment === '0'){
          $('.videoPlay-comment .commentheader').hide()
          $('.videoPlay-comment .line').hide()
          $('.commentInpt').attr('disabled',true)
          $('.commentInpt').attr('placeholder','暂不支持评论')
        }else{
          getComment({'infoId':commentObjectId})
        }
        //用于占位置得封面图（已删除）
        let img = `<img src="../../images/allPic/shipingbtn.png" alt="" class="playBtn">
                    <img src="${res.data.result.coverImgUrl}" alt="" class="bgcImg">`

        $('.videoPlay-seatimg').append(img)

        let result = res.data.result

        let creatTime = result.issuerDttm * 1000
        let nowTime = +new Date().valueOf()
        let year = new Date(creatTime).getFullYear()
        let month = new Date(creatTime).getMonth() + 1 < 10 ? '0' + (new Date(creatTime).getMonth() + 1) : new Date(creatTime).getMonth() + 1
        let day = new Date(creatTime).getDate() < 10 ? '0' + new Date(creatTime).getDate() : new Date(creatTime).getDate()
        let hour = new Date(creatTime).getHours() < 10 ? '0' + new Date(creatTime).getHours() : new Date(creatTime).getHours()
        let minute = new Date(creatTime).getMinutes() < 10 ? '0' + new Date(creatTime).getMinutes() : new Date(creatTime).getMinutes()
        if(nowTime - creatTime < 30 * 60 * 1000){
          if(nowTime - creatTime < 1 * 60 * 1000){
            result.issuerDttm = '刚刚'
          }else{
            result.issuerDttm = parseInt((nowTime - creatTime) / 1000 / 60) + '分钟前'
          }
        }else if(nowTime - creatTime < 24 * 60 * 60 * 1000){
          if(nowTime - creatTime < 60 * 60 * 1000){
            result.issuerDttm = '1小时前'
          }else {
            result.issuerDttm = parseInt((nowTime - creatTime) / 1000 / 60 / 60) + '小时前'
          }
        }else if(new Date().getDate() - new Date(creatTime).getDate() == 1 && new Date().getMonth() == new Date(creatTime).getMonth() && new Date().getFullYear() == new Date(creatTime).getFullYear()){
          result.issuerDttm = '昨天' + hour + ':' + minute
        }else{
          result.issuerDttm = year + '-' + month + '-' + day + ' ' + hour + ':' + minute
        }
        let videoDetail =
                  `<div class="title" onclick="goOrgdetails({'orgCode':'${result.orgCode}'})">
                    <div style="display:${result.orgCode ? 'block' : 'none'}">
                      <img  class="head-img" src="${result.headImg}" />
                    ${result.orgName}
                    </div>

                    <div>
                      ${result.mainTitle}
                    </div>

                    </div>

                    <div class="time flex-row align-items-center justify-content-between">
                                                <span >发布时间：${result.issuerDttm}</span>

                    </div>`

        $('.videoDetails').append(videoDetail)

      }else{
        // jsBridge.toast('数据异常')
      }
    })
  }

  //点击文章里面的举报
  function report() {
    jsBridge.showReportDialog({infoId: commentObjectId, infoType: "2"})
  }

  function goOrgdetails(params){
    console.log('---', params)
    // jsBridge.openWindow('/html/details/Information-details.html?infoId=' + params.infoId + '&infoType=1&funcCode=' + params.funcCode + '&isopencomment=0',{}, {noBar: false})
    jsBridge.jumpOrg({
      'orgCode': params.orgCode,
    })
  }
  //获取视频章节列表
  function getLsit(params){
    Server.getVideoList.chapterList({'infoId':params.infoId}).then(res => {
    // Server.getVideoList.chapterList({'infoId':'5a478ff614b6402d9367ca6cbad1e3c01'}).then(res => {
      $('.chapterlist').empty()
      $('.chaptercontent').empty()
      if(res.code === 0){
        let list = []
        listLength = res.data.result.length
        let listCount =
                `<span>章节列表</span>
                <span>共${listLength}个章节</span>`

        list = res.data.result
        list.map((item,index) => {
          let desc =
          `<div class="desc" onclick="playVideo({'videoUrl':'${item.videoUrl}'},this)" data-url="${item.videoUrl}">
                <img src="../../images/allPic/clickbtn.png" alt="" class="img1">
                <img src="../../images/allPic/noclickbtn.png" alt="" class="img2">
                <span class='descSpan'>${item.chapterTitle}</span>
            </div>`
          $('.chaptercontent').append(desc)
          $('.chapterlist').append(listCount)
        })
        if(type !== '1') { // type!=1 上视频有章节
          $('.chapterlist').css('display', 'block')
          $('.wrapper').css('display', 'block')
        } else {
          $('.chapterlist').css('display', 'none')
          $('.wrapper').css('display', 'none')
        }
      }else{
        // jsBridge.toast('数据异常')
      }
    })
  }
  //获取视频评论
  function getComment(params){
    Server.informationcommentList.getComment({'pageNum':pageNum,'pageSize':10,'commentObjectId':params.infoId,'datasource':'1'}).then(res => {
      console.log(res,'pinglun')
      if(res.code === 0){
        $('.commentheader').empty()
        let list = res.data
        let count = `<span>全部评论（${res.commentTotal}）</span>`
        $('.commentheader').append(count)

        list.map((item,index) => {
          let creatTime = item.createDttm * 1000
          let nowTime = +new Date().valueOf()
          let year = new Date(creatTime).getFullYear()
          let month = new Date(creatTime).getMonth() + 1 < 10 ? '0' + (new Date(creatTime).getMonth() + 1) : new Date(creatTime).getMonth() + 1
          let day = new Date(creatTime).getDate() < 10 ? '0' + new Date(creatTime).getDate() : new Date(creatTime).getDate()
          let hour = new Date(creatTime).getHours() < 10 ? '0' + new Date(creatTime).getHours() : new Date(creatTime).getHours()
          let minute = new Date(creatTime).getMinutes() < 10 ? '0' + new Date(creatTime).getMinutes() : new Date(creatTime).getMinutes()
          if(nowTime - creatTime < 30 * 60 * 1000){
            if(nowTime - creatTime < 1 * 60 * 1000){
              item.createDttm = '刚刚'
            }else{
              item.createDttm = parseInt((nowTime - creatTime) / 1000 / 60) + '分钟前'
            }
          }else if(nowTime - creatTime < 24 * 60 * 60 * 1000){
            if(nowTime - creatTime < 60 * 60 * 1000){
              item.createDttm = '1小时前'
            }else {
              item.createDttm = parseInt((nowTime - creatTime) / 1000 / 60 / 60) + '小时前'
            }
          }else if(new Date().getDate() - new Date(creatTime).getDate() == 1 && new Date().getMonth() == new Date(creatTime).getMonth() && new Date().getFullYear() == new Date(creatTime).getFullYear()){
            item.createDttm = '昨天' + hour + ':' + minute
          }else{
            item.createDttm = year + '-' + month + '-' + day + ' ' + hour + ':' + minute
          }
        })

        list.map((v,i) => {
          let comment =
            `<div class="commentmain" onclick="sendComment1('${v.userName}', '${v.commentId}')">
                <div class='comstatus' style="display:${v.status === '2' ? 'block' : 'none'}">审核中</div>
                <div class="mainTop">
                    <div class="imgbox"><img src="${v.headUrl ? v.headUrl : '../../images/allPic/touxiang.png'}" alt=""></div>

                </div>
                <div class="mainCenter">
                  <div>${v.userName}
                    <span style="display:${(v.isTop === '1') ? 'inline-block' : 'none'}" class="comment-isTop">精选</span>
                  </div>
                  <div class="maintext">${v.content}</div>
                  <div class="mainbottom">
                      <div class="mainbottom-left">
                          <span>${v.createDttm}</span>
                          <span onclick="sendComment1('${v.userName}', '${v.commentId}')" style="display:${v.status === '2' ? 'none' : 'inline-block'}">回复</span>
                      </div>

                  </div>
                  <div class="secondcomment-seeAll" style="display:${(v.childCount !== 0 && v.status === '1') ? 'block' : 'none'}" onclick="gocomment(event, {'datasource':'1','isopencomment':'0','parentId':'${v.commentId}','commentObjectId':'${params.infoId}'})">
                    <span>查看全部评论${v.childCount}条></span>
                  </div>
                </div>
                <div class="mainbottom-right" style="display:${v.status === '2' ? 'none' : 'block'}">
                  <div style='display:inline-block;vertical-align:middle;'>
                    <img src="${configColorType === '1' ? '../../images/allPic/blackdianzan.png' : '../../images/allPic/nodianzan1.png'}" alt="" data-status='1' style="display:${v.ifThumbsup === '1' ? 'none' : 'block'}" onclick="priase({'status':'${v.ifThumbsup === '0' ? '1' : '0'}','thumbupObjectId':'${v.commentId}'},this)" class='tpimg'>
                    <img src="../../images/allPic/yidianzan1.png" alt="" data-status='0' style="display:${v.ifThumbsup === '1' ? 'block' : 'none'}" onclick="priase({'status':'${v.ifThumbsup === '1' ? '0' : '1'}','thumbupObjectId':'${v.commentId}'},this)" class='tpimg'>
                  </div>
                    <span style='vertical-align:middle;'>${v.thumbsupCnt}</span>
                </div>
            </div>`

          $('.maincomment').append(comment)
        })

      }else{
        // jsBridge.toast('数据异常')
      }
    })
  }
  //获取底部点赞状态和收藏状态
  function getfooterStatus(params){
    Server.getVideoList.getfooterCollet({'collectionObjectId':params.infoId,'objectSource':'2'}).then(res => {
      if(res.code === 0){
        collectStatus = res.data.code
        Server.getVideoList.getfooterPriase({'thumbupObjectId':params.infoId,'objectSource':'7'}).then(res => {
          $('.mainfooter').empty()
          if(res.code === 0){
            let code = res.data.code
            let footer =
            `<div class="footer-noconfirm" id='footer-noconfirm'  style="display:${isopencomment === '0' ? 'block' : 'none'}">
                <div class="videoPlay-footer-imgBox" onclick="picComment()">
                  <img src="${configColorType === '1' ? '../../images/allPic/blackpinglun.png' : '../../images/allPic/dapinglun.png'}" alt="">
                </div>
                <div class="videoPlay-footer-imgBox">
                  <img src="${configColorType === '1' ? '../../images/allPic/blackdianzan.png' : '../../images/allPic/danodianzan.png'}" alt="" data-status='1' onclick="ftpriase({'status':'${code === '0' ? '1' : '0'}','thumbupObjectId':'${commentObjectId}'},this)" style="display:${code === '1' ? 'none' : 'block'}">
                  <img src="../../images/allPic/dayidianzan.png" alt="" data-status='0' onclick="ftpriase({'status':'${code === '1' ? '0' : '1'}','thumbupObjectId':'${commentObjectId}'},this)" style="display:${code === '1' ? 'block' : 'none'}">
                </div>
                <div class="videoPlay-footer-imgBox">
                  <img src="${configColorType === '1' ? '../../images/allPic/blackshoucang.png' : '../../images/allPic/noshoucang.png'}" alt="" data-status='1' onclick="ftcollect({'status':'${collectStatus === '0' ? '1' : '0'}','collectionObjectId':'${commentObjectId}'},this)" style="display:${collectStatus === '1' ? 'none' : 'block'}">
                  <img src="../../images/allPic/yishoucang.png" alt="" data-status='0' onclick="ftcollect({'status':'${collectStatus === '1' ? '0' : '1'}','collectionObjectId':'${commentObjectId}'},this)" style="display:${collectStatus === '1' ? 'block' : 'none'}">
                </div>
              </div>
              <div class="footer-confirm" id='footer-confirm' onclick="sendcomment()"  style="display:${isopencomment === '0' ? 'none' : 'block'};padding-left:0.4rem;">发送</div>`

            $('.mainfooter').append(footer)
          }else if(res.code === -8){
            let footer =
            `<div class="footer-noconfirm" id='footer-noconfirm'  style="display:${isopencomment === '0' ? 'block' : 'none'}">
                <div class="videoPlay-footer-imgBox" onclick="picComment()">
                  <img src="${configColorType === '1' ? '../../images/allPic/blackpinglun.png' : '../../images/allPic/dapinglun.png'}" alt="">
                </div>
                <div class="videoPlay-footer-imgBox">
                  <img src="${configColorType === '1' ? '../../images/allPic/blackdianzan.png' : '../../images/allPic/danodianzan.png'}" alt="" onclick="ftpriase()">
                </div>
                <div class="videoPlay-footer-imgBox">
                  <img src="${configColorType === '1' ? '../../images/allPic/blackshoucang.png' : '../../images/allPic/noshoucang.png'}" alt="" onclick="ftcollect()">
                </div>
              </div>
              <div class="footer-confirm" id='footer-confirm' onclick="sendcomment()"  style="display:${isopencomment === '0' ? 'none' : 'block'};padding-left:0.4rem;">发送</div>`

            $('.mainfooter').append(footer)
          }else{
            // jsBridge.toast('数据异常')
          }
        })

      }else if(res.code === -8){
        let footer =
            `<div class="footer-noconfirm" id='footer-noconfirm'  style="display:${isopencomment === '0' ? 'block' : 'none'}">
                <div class="videoPlay-footer-imgBox" onclick="picComment()">
                  <img src="${configColorType === '1' ? '../../images/allPic/blackpinglun.png' : '../../images/allPic/dapinglun.png'}" alt="">
                </div>
                <div class="videoPlay-footer-imgBox">
                  <img src="${configColorType === '1' ? '../../images/allPic/blackdianzan.png' : '../../images/allPic/danodianzan.png'}" alt="" onclick="ftpriase()">
                </div>
                <div class="videoPlay-footer-imgBox">
                  <img src="${configColorType === '1' ? '../../images/allPic/blackshoucang.png' : '../../images/allPic/noshoucang.png'}" alt="" onclick="ftcollect()">
                </div>
              </div>
              <div class="footer-confirm" id='footer-confirm' onclick="sendcomment()"  style="display:${isopencomment === '0' ? 'none' : 'block'};padding-left:0.4rem;">发送</div>`

        $('.mainfooter').append(footer)
      }else {

      }
    })

  }
  //input框聚焦失焦,加定时器确保点击事件先触发
  $('.commentInpt').blur(function(){
    setTimeout(function(){
      $('#footer-noconfirm').show()
      $('#footer-confirm').hide()
    },100)
    $('.commentInpt').attr('placeholder', '请说说你的看法...')
    isopencomment = '0'
  })
  $('.commentInpt').focus(function(){
    setTimeout(function(){
      $('#footer-noconfirm').hide()
      $('#footer-confirm').show()
    },100)
  })
  // 回复一级评论
  function sendComment1 (username, pid) {
    // console.log(event)
    // event.stopPropagation()
    // event.preventDefault()
    // token = '3de7dae4593ccf0d86b0a6230fb23e99'
    if(token){
      parentId = pid
      // console.log('parentId', parentId, pid)
      level = 2
      // $('.commentInpt').val('@'+username+' ')
      $('.commentInpt').attr('placeholder', '回复' + username)
      isopencomment = '1'
      $('.commentInpt').focus()
    }else{
      // jsBridge.toast('暂未登录，请先登录...')
      jsBridge.openLogin()
    }
  }
  function stopPropagation(e) {
    e = e || window.event
    if(e.stopPropagation) { //W3C阻止冒泡方法
      e.stopPropagation()
    } else {
      e.cancelBubble = true //IE阻止冒泡方法
    }
  }
  //从视频的评论点击回复做二级评论,唤起输入框
  function dosecondcomment(params){
    stopPropagation()
    if(token){
      jsBridge.openWindow('/html/comment/commentdetails.html?parentId=' + params.parentId + '&datasource=1' + '&isopencomment=' + params.isopencomment + '&commentObjectId=' + params.commentObjectId,{}, {noBar: false})
    }else{
      // jsBridge.toast('暂未登录，请先登录...')
      jsBridge.openLogin()
    }
  }
  //去评论详情页但是不换起输入框
  function gocomment(event, params){
    // console.log(111)
    // console.log(params)
    // if(params.status === '2'){
    //   return false
    // }else{
    //   jsBridge.openWindow('/html/comment/commentdetails.html?parentId='+params.parentId+'&datasource=1'+'&isopencomment='+params.isopencomment+'&commentObjectId='+params.commentObjectId,{}, {noBar: false})
    // }
    event.stopPropagation()
    event.preventDefault()
    jsBridge.openWindow('/html/comment/commentdetails.html?parentId=' + params.parentId + '&datasource=1' + '&isopencomment=' + params.isopencomment + '&commentObjectId=' + params.commentObjectId,{}, {noBar: false})
    // if(token){
    //   jsBridge.openWindow('/html/comment/commentdetails.html?parentId='+params.parentId+'&datasource=1'+'&isopencomment='+params.isopencomment+'&commentObjectId='+params.commentObjectId,{}, {noBar: false})
    // }else{
    //   jsBridge.openLogin()
    // }
  }
  //点击章节播放视频
  function playVideo(params,item){
    // <source src="">
    console.log(params,item)
    let url = params.videoUrl
    // $('.videoPlay-seatimg').hide().siblings().show()
    // $('#video').attr('src',params.videoUrl)
    // $('#video')[0].play()
    let myVideo = videojs('video',{fluid: true},{
      bigPlayButton: true,
      textTrackDisplay: false,
      posterImage: false,
      errorDisplay: false,
    })
    if (/\.m3u8$/.test(url)) { //判断视频源是否是m3u8的格式
      myVideo.src({
        src: url,
        type: 'application/x-mpegURL' //在重新添加视频源的时候需要给新的type的值
      })
    } else {
      myVideo.src(url)
    }
    myVideo.load()
    myVideo.play()
    //修改类名
    $(item).addClass('active').siblings().removeClass('active')
  }
  //
  // function playbgVideo(params){
  //   // console.log($(params).children().eq(1))
  //   $(params).hide().siblings().show()
  //   $(params).next().play()
  // }
  //点击发送增加一级评论
  function sendcomment(){
    // token = '3de7dae4593ccf0d86b0a6230fb23e99'
    if(token){
      let content = $('.commentInpt').val()
      if(content === ''){
        jsBridge.toast('内容不为空')
      }else{
        Server.informationcommentList.addcomment({'parentId': level == 2 ? parentId : '0','commentObjectId':commentObjectId,'content':content,'datasource':'1','objectSource':'2'}).then(res => {
          if(res.code === 0){
            jsBridge.toast('评论成功，审核通过后将展示在评论区哦~')
            $('.commentInpt').val('')
            $('.commentInpt').attr('placeholder', '请说说你的看法...')
            $('.maincomment').empty()
            pageNum = 1
            getComment({'infoId':commentObjectId,'pageNum':pageNum})
            $('.commentInpt').blur()
            level = 1
          }else if(res.code === -8){
            // jsBridge.toast('数据异常')
            jsBridge.delData('token')
            token = ''
            jsBridge.toast('登录过期，请重新登录')
          }else{

          }
        })
      }
    }else{
      // jsBridge.toast('暂未登录，请先登录...')
      jsBridge.openLogin()
    }
  }
  //点击评论小图标做一级评论
  function picComment(){
    if(isComment === '0'){
      return false
    }else{
      $('.commentInpt').focus()
    }
  }
  //点击评论的点赞按钮
  function priase(params1,params2){
    event.stopPropagation()
    // console.log(params1,params2)
    if(token){
      let status = $(params2).attr('data-status')
      if(status === '1'){
        let num = $(params2).parent().next().text()
        $(params2).parent().next().text(+num + 1)
      }else{
        let num = $(params2).parent().next().text()
        $(params2).parent().next().text(+num - 1)
      }
      $(params2).hide().siblings().show()
      Server.getVideoList.updatestatus({'status':status,'thumbupObjectId':params1.thumbupObjectId,'datasource':1,'objectSource':'7','source':''}).then(res => {
        // console.log(res)
        if(res.code === 0){
          //切换点赞状态并且重新请求数据
          // getComment({'infoId':commentObjectId})
        }else if(res.code === -8){
          // jsBridge.toast(res.msg)
          // jsBridge.openLogin()
          jsBridge.delData('token')
          token = ''
          jsBridge.toast('登录过期，请重新登录')
        }else{

        }
      })
    }else{
      // jsBridge.toast('暂未登录,请先登录')
      jsBridge.openLogin()
    }
  }
  //点击底部的点赞按钮
  function ftpriase(params1,params2){
    console.log(params1,params2)
    event.stopPropagation()
    let status = $(params2).attr('data-status')
    if(token){
      $(params2).hide().siblings().show()
      Server.getVideoList.updatestatus({'status':status,'thumbupObjectId':params1.thumbupObjectId,'datasource':1,'objectSource':'7','source':'2'}).then(res => {
        // console.log(res,'update')
        if(res.code === 0){
          //切换图片状态并且重新获取数据

          // getfooterStatus({'infoId':commentObjectId})
        }else if(res.code === -8){
          // jsBridge.toast(res.msg)
          // jsBridge.openLogin()
          jsBridge.delData('token')
          token = ''
          jsBridge.toast('登录过期，请重新登录')
        }else{

        }
      })
    }else{
      // jsBridge.toast('暂未登录,请先登录...')
      jsBridge.openLogin()
    }
  }
  //点击收藏按钮
  function ftcollect(params1,params2){
    event.stopPropagation()
    let status = $(params2).attr('data-status')
    if(token){
      $(params2).hide().siblings().show()
      Server.getVideoList.updaCollectestatus({'status':status,'collectionObjectId':params1.collectionObjectId,'datasource':1,'objectSource':'2','source':'2'}).then(res => {
        console.log(res,'update')
        // alert(JSON.stringify(res))
        if(res.code === 0){
          //切换图片状态并且重新获取数据

          // getfooterStatus({'infoId':commentObjectId})
        }else if(res.code === -8){
          // jsBridge.toast(res.msg)
          // jsBridge.openLogin()
          jsBridge.delData('token')
          token = ''
          jsBridge.toast('登录过期，请重新登录')
        }else{

        }
      })
    }else{
      // jsBridge.toast('暂未登录,请先登录...')
      jsBridge.openLogin()
    }
  }
  //点击返回按钮
  function closeWindow(){
    jsBridge.closeWindows()
  }
  //滑动加载下一页
  document.addEventListener('scroll',function(){
    let top = $('.videoPlay-comment').offset().top
    let height = $('.videoPlay-comment').outerHeight(true)
    let maxHeight = document.body.offsetHeight
    let scroll = $(document).scrollTop()
    if(Math.round(top + height - maxHeight) === Math.round(scroll) ){
      pageNum++
      getComment({'infoId':commentObjectId,'pageNum':pageNum})
    }
  })
  //分享
  function goShare(){
    event.stopPropagation()
    jsBridge.share({'scene':'0,1','type':'url','url':shareUrl + '/html/video/videoplay.html?infoId=' + commentObjectId + '&isopencomment=0','title':sharetitle,'content':sharecontent,'image':''})
  }
  //跳转机构详情页
  function goToOrgPage(orgCode) {
    jsBridge.goToOrgPage({'orgCode':orgCode})
  }
</script>
</html>
